<template>
    <el-form :model="form" label-width="auto" style="max-width: 600px">
        <el-form-item label="物品名字">
            <el-input v-model="form.name" />
        </el-form-item>
        <el-form-item label="入库日期">
            <el-col :span="11">
                <el-date-picker v-model="form.date" type="date" :disabled-date="disabledDate" placeholder="Pick a date"
                    style="width: 100%" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
            </el-col>
        </el-form-item>
        <el-form-item label="设备型号">
            <el-input v-model="form.model" />
        </el-form-item>
        <el-form-item label="设备类型">
            <el-radio-group v-model="form.type">
                <el-radio-button label="相机" value="相机" />
                <el-radio-button label="雷达" value="雷达" />
                <el-radio-button label="陀螺仪" value="陀螺仪" />
                <el-radio-button label="其他" value="其他" />
            </el-radio-group>
            <el-input v-model="form.type" v-show="form.type =='其他'" />
        </el-form-item>
        <el-form-item label="设备数量">
            <el-input-number v-model="form.num" :min="1" :max="99" @change="handleChange" />
        </el-form-item>
        <el-form-item label="状态">
            <el-radio-group v-model="form.state">
                <el-radio value="未启用">未启用</el-radio>
                <el-radio value="已寄出">已寄出</el-radio>
                <el-radio value="使用中">使用中</el-radio>
            </el-radio-group>
        </el-form-item>
        <el-form-item label="备注">
            <el-input v-model="form.desc" type="textarea" />
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="onSubmit">Create</el-button>
            <el-button>Cancel</el-button>
        </el-form-item>
    </el-form>
</template>

<script lang="ts" setup>
import { reactive, ref } from 'vue'
import { Add } from '../../components/device/add'
const form = reactive({
    name: '',// 名称
    date: '', // 入库日期
    type: '',// 类型
    state: '',// 状态
    desc: '', // 备注
    num: 1 ,// 数量
    model: '', // 型号
})
const disabledDate = (time: Date) => {
    return time.getTime() > Date.now()
}
const handleChange = (value: number) => {
    console.log(value)
}
const onSubmit = async() => {
    console.log('submit!', form)
    console.log('submit!', form.date)
    let add = new Add(form)
    console.log(await add.add())
}
</script>
